<%@ page pageEncoding="UTF-8" contentType="text/html; charset=UTF-8" %>

<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<fmt:setBundle basename="baiwa.rta.language.room.room_label" />

<script type="text/javascript" src="../js/controller/room/RM005.js" ></script>

<div id="container">
	<div id="content">
		<div class="warpper">
			<table class="from" cellpadding="0" cellspacing="0" border="0" style="width: 100%;">
				<tr>
					<td colspan="9" class="header2" style="border-bottom: 1px #bbb solid;">Criteria</td>
				</tr>
			</table>
			<form action="">
			<table class="from" cellpadding="0" cellspacing="0" border="0" style="width: 100%;">
				<tr>
					<td class="header">Function Room </td>
					<td>
<!-- 						<input id="fnRoom" placeholder="Function Room"  type="text"  > -->
						<select  id="fnRoom" name="fnRoom">
						</select>
					</td>
					
<!-- 					<td class="header">Room Status</td> -->
<!-- 					<td><select id="roomStatus"></select></td> -->
					
					<td class="header">Payment Status </td>
					<td colspan="3">
<!-- 						<select id="paymentStatus"> -->
						<select id="paymentStatus" name="paymentStatus">
						</select>
						
					</select></td>
				</tr>
				<tr>
					<td class="header">Start Date </td>
					<td><input type="text" id="startDate" placeholder="Start Date"/></td>
					
					<td class="header">End Date </td>
					<td><input type="text" id="endDate" placeholder="End Date"/></td>
					
					<td class="header">Start Time </td>
					<td><input type="text" id="startTime" placeholder="Start Time"></td>
					
					<td class="header">End Time </td>
					<td><input type="text" id="endTime" placeholder="End Time"/></td>
					
				</tr>
				
			</table>
			<br>
			<center>
				<table>
					<tr  align="right" >
                    	<button type="button" class="btn btn-info btn-default" onclick="RM005.search()"><i class="fa fa-search"></i> Search</button>
					</tr>
					<tr >&nbsp</tr>
					<tr align="left">
						<button type="reset" id="btnClear"  class="btn btn-info btn-default" ><i class="fa fa-refresh"></i> Clear</button>
					</tr>
					
				</table>
			</center>
			
			</form>
			
			<table class="from" cellpadding="0" cellspacing="0" border="0" style="width: 100%;">
				<tr>
					<td colspan="9" class="header2" style="border-bottom: 1px #bbb solid;">Detail</td>
				</tr> 
				<tr>
					<td colspan="9">
						<button type="button" class="btn btn-success" onclick="location='RM005A'"><i class="fa fa-plus"></i>&nbsp;&nbsp;New</button>
					</td>
				</tr>
			</table>
			
			<div style="width: 100%;">
				<table id="dataTable" cellpadding="2" cellspacing="0" border="0" class="display" >
					<thead >
						<tr>
							<th style="text-align: center;"></th>
							<th style="text-align: center;">Function Room </th>
							<th style="text-align: center;">Requestor</th>
							<th style="text-align: center;">Payment Status </th>
							<th style="text-align: center;">Start Date </th>
							<th style="text-align: center;">End Date </th>
							<th style="text-align: center;">Start Time </th>
							<th style="text-align: center;">End Time </th>
						</tr>
					</thead>
					
				</table>
			</div>
			
		</div>
	</div>
</div>
<script>
$(document).ready(function() {
    
    _log(' ######## --- RM005 -------######');
    
    _COMMON.renderDatePicker('startDate');
    _COMMON.renderDatePicker('endDate');
    _COMMON.renderTimePicker('startTime');
    _COMMON.renderTimePicker('endTime');
    
});
</script>
